<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>本地存储</title>
</head>
<body>
<!--本地存储   关闭浏览器数据不请空-->
<h2>localStorage</h2>
<button onclick="saveData()">点我保存一个数据</button>
<button onclick="readData()">点我读取一个数据</button>
<button onclick="deleteData()">点我删除一个数据</button>
<button onclick="deleteAllData()">点我清空</button>
</body>
<script type="text/javascript">
  let p = {name: '张三', age: 18}

  function saveData() {
    localStorage.setItem('msg', 'hello!')
    localStorage.setItem('person', JSON.stringify(p))
  }

  function readData() {

    console.log(localStorage.getItem("msg"))
    console.log(JSON.parse(localStorage.getItem("person")))
  }
  function deleteData() {
    localStorage.removeItem('msg')
  }
  function deleteAllData() {
    localStorage.clear();
  }
</script>
</html>
